
<div class="mui-content bg-gray">
  <div class="header">
    <div class="top-bar">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <div class="flex text-center">信贷猫</div>
    </div>
    <div class="d-flex text-center p">
      <div class="flex">
        参考月利率
        <p>0.3%</p>
      </div>
      <div class="flex">
        每月利息（元）
        <p>请选择金额</p>
      </div>
      <div class="flex">
        平均额度
        <p>2.202万</p>
      </div>
    </div>
    <div class="d-flex select-group p-x p-b">
      <select class="flex text-center m-0">
        <option value="1">3000-1万</option>
        <option class="2">1万-2万</option>
      </select>
      <select class="flex text-center m-0">
        <option value="1">1-3个月</option>
        <option value="2">3-24个月</option>
      </select>
    </div>
  </div>

  <div class="b-container" >
    <div class="b-body">
      <div class="flex-table p-0 m-b">
        <img class="flex-side " src="http://xdm.mengzhudai.com/{{product.picurl}}">
        <div class="flex">
          {{product.title}}
          <div class="strat-row">
            <span class="start {{product.islevel >= 1 ? 'active' : ''}}"></span>
            <span class="start {{product.islevel >= 2 ? 'active' : ''}}"></span>
            <span class="start {{product.islevel >= 3 ? 'active' : ''}}"></span>
            <span class="start {{product.islevel >= 4 ? 'active' : ''}}"></span>
            <span class="start {{product.islevel >= 5 ? 'active' : ''}}"></span>
          </div>
          <div class="">
            <span class="tag {{ i%3==0 ? 'tag-orange' : ''}} {{ i%3==1 ? 'tag-red' : ''}} {{ i%3==2 ? 'tag-gray' : ''}}" *ngFor="let flag of product.flag;let i = index">
              {{ flags[flag] }}
            </span>
          </div>
        </div>
      </div>
      <div class="d-flex">
        <span>产品人气</span>
        <div class="process"></div>
        <span>{{product.popularity}}</span>
      </div>
      <div class="d-flex">
        <span>放款速度</span>
        <div class="process"></div>
        <span>{{product.speed}}</span>
      </div>
      <div class="d-flex">
        <span>下款概率</span>
        <div class="process"></div>
        <span>{{product.probability}}</span>
      </div>
    </div>
  </div>

  <div class="b-container" >
    <div class="b-header">
      申请条件&要点
    </div>
    <div class="b-body">
      <p>1.18-55周岁</p>
      <p>2.需本人持有信用卡</p>
      <p>3.掌心猫客服电话：400-870-5151</p>
    </div>
  </div>
  <div class="b-container" >
    <div class="b-header">
      申请条件&要点
    </div>
    <div class="b-body">
      <img src="./assets/images/process.png" class="img" style="width: 70%; height: auto">
    </div>
  </div>
  <div class="b-container" >
    <div class="b-header">
      借款审核细节
    </div>
    <div class="b-body" [innerHtml]="product.conditions"></div>
  </div>

  <div class="b-container" >
    <div class="b-header">
      新手指导
    </div>
    <div class="b-body">
      <p>1.手机号码必须是通过运营商实名认证，且认证时间最好为半年以上</p>
      <p>2.增信项：芝麻分、公积金、人行征信等信息</p>
      <p>3.以上仅是速贷之家为您提供的申请建议，不作为必然参照</p>
    </div>
  </div>

  <div class="b-container">
    <div class="b-header">
      产品优势
    </div>
    <div class="b-body">
      <p>{{ product.brief }}</p>
    </div>
  </div>
  <div class="b-btn" (click)="setOrder(product.id,product.outerurl)">
    立即申请
  </div>
</div>














